<template>
  <div class="scheme_list" v-if="state.schemOptions.task_name != null">
    <div class="condition">
    </div>
    <div style="height: 100%">
      <el-scrollbar height="100%">
        <div class="scheme_body" style="position: relative">
          <el-form inline v-if="state.schemOptions.task_name != null" label-width="120px">
            <el-form-item label="用户配置：" style="width: 45%">
              <el-select v-model="state.schemOptions.copy_users_config" placeholder="用户配置"
                style="width: 240px; height: 32px">
                <el-option v-for="item in state.users" :key="item.value" :label="item.label" :value="item.value" />
              </el-select>
            </el-form-item>
            <el-form-item label="跟单方向：" style="width: 45%">
              <el-select v-model="state.schemOptions.copy_direction" placeholder="跟单方向"
                style="width: 240px; height: 32px">
                <el-option label="正向" value="up" />
                <el-option label="反向" value="down" />
              </el-select>
            </el-form-item>
            <el-form-item label="跟单金额类型：" style="width: 45%">
              <el-select v-model="state.schemOptions.copy_stake_type" placeholder="跟单金额类型" @change="changestaketype"
                style="width: 240px; height: 32px">
                <el-option label="倍数" value="times" />
                <el-option label="总数" value="total" />
              </el-select>
            </el-form-item>
            <!-- <el-form-item label="跟单金额范围：" style="width: 45%">
              <app-range-input :data="state.schemOptions" :name1="`copy_stake_min`" :name2="`copy_stake_max`"
                style="width: 240px; height: 32px" />
            </el-form-item> -->
            <el-form-item label="跟单金额总数：" style="width: 45%" v-if="state.schemOptions.copy_stake_type == 'total'">
              <el-input-number v-model="state.schemOptions.copy_stake_min" :min="50" :max="9999999999999" controls-position="right" style="width: 240px; height: 32px" />
            </el-form-item>
            <el-form-item label="跟单金额倍数：" style="width: 45%" v-if="state.schemOptions.copy_stake_type == 'times'">
              <el-input-number v-model="state.schemOptions.copy_stake_min" :min="1" :max="100" controls-position="right" style="width: 240px; height: 32px" />
            </el-form-item>
            <el-form-item label="金额类型：" style="width: 45%">
              <el-select v-model="state.schemOptions.stake_type" placeholder="金额类型" style="width: 240px; height: 32px">
                <el-option label="实数" value="real" />
                <el-option label="虚数" value="imaginary" />
              </el-select>
            </el-form-item>
            <el-form-item label="赔率下浮：" style="width: 45%">
              <el-input-number v-model="state.schemOptions.odd_down" controls-position="right"
                style="width: 240px; height: 32px" />
            </el-form-item>
            <el-form-item label="赔率范围：" style="width: 45%">
              <app-range-input :data="state.schemOptions" :name1="`odd_min`" :name2="`odd_max`"
                style="width: 240px; height: 32px" />
            </el-form-item>
            <el-form-item label="跟单时间类型：" style="width: 45%">
              <el-select v-model="state.schemOptions.copy_time_type" placeholder="跟单时间类型" style="width: 240px; height: 32px">
                <el-option label="立刻下单" value="on_time" />
                <el-option label="延迟下单" value="hold_on" />
              </el-select>
            </el-form-item>
            <el-form-item label="下单时间：" style="width: 45%" v-if="state.schemOptions.copy_time_type == 'hold_on'">
              <app-range-input :data="state.schemOptions" :name1="`copy_time_min`" :name2="`copy_time_max`"
                style="width: 240px; height: 32px" />
            </el-form-item>
            <el-form-item label="时间类型：" style="width: 45%">
              <el-select v-model="state.schemOptions.event_type" placeholder="时间类型" style="width: 240px; height: 32px">
                <el-option label="全部" value="all" />
                <el-option label="赛前" value="early" />
                <el-option label="赛中" value="live" />
              </el-select>
            </el-form-item>
            <el-form-item label="游戏类型：" style="width: 45%">
              <el-select v-model="state.schemOptions.game_type" placeholder="游戏类型" style="width: 240px; height: 32px">
                <el-option label="全部" value="all" />
                <el-option label="足球" value="soccer" />
                <el-option label="篮球" value="basketball" />
              </el-select>
            </el-form-item>
          </el-form>
        </div>
      </el-scrollbar>
    </div>
  </div>
</template>

<script setup>
import { onMounted } from 'vue'
const { store, state } = inject('Scheme')


const changestaketype = () => {
  if (state.schemOptions.copy_stake_type == 'total') {
    state.schemOptions.copy_stake_min = 50
  } else {
    state.schemOptions.copy_stake_min = 1
  }
}

</script>

<style lang="scss" scoped>
.scheme_list {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.condition {
  display: flex;
  flex-direction: column;

  .condition_label {
    font-size: 16px;
    font-weight: 600;
    color: #333;
  }

  .condition_content {
    margin-top: 0px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333;
  }
}
</style>

<style>
.condition_content .range_input {
  border-radius: 4px;
}

.condition_content .range_input input {
  font-size: 14px !important;
}

.scheme_collapse {
  margin-left: 32px;
  width: 988px;
  border: none;
  border: none;
}

.scheme_collapse .el-collapse-item__header,
.scheme_collapse .el-collapse-item__header.is-active {
  border-bottom: 1px solid#ebebeb !important;
}

.scheme_collapse .el-collapse-item__wrap {
  border: none;
}

.scheme_collapse .el-collapse-item__content {
  padding-bottom: 0;
}
</style>